<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>6-Digit Input</title>  
    <style>  
        .digit-input {  
            width: 50px;  
            height: 50px;
            text-align: center;  
            margin-right: 5px;  
        }  
    </style>  
</head>  
<body>  
    <div>  
        <input type="text" maxlength="1" class="digit-input" oninput="handleInput(this, 0)">  
        <input type="text" maxlength="1" class="digit-input" oninput="handleInput(this, 1)">  
        <input type="text" maxlength="1" class="digit-input" oninput="handleInput(this, 2)">  
        <input type="text" maxlength="1" class="digit-input" oninput="handleInput(this, 3)">  
        <input type="text" maxlength="1" class="digit-input" oninput="handleInput(this, 4)">  
        <input type="text" maxlength="1" class="digit-input" oninput="handleInput(this, 5)">  
    </div>  
  
    <script>  
        function handleInput(input, index) {  
            const inputs = document.querySelectorAll('.digit-input');  
            const nextInput = inputs[index + 1];  
            const allFilled = Array.from(inputs).every(inp => inp.value.length === 1);  
  
            if (input.value.length === 1 && nextInput) {  
                nextInput.focus();  
            }  
  
            if (allFilled) { 
                let combinedValue = '';
                inputs.forEach(inp => combinedValue += inp.value); 
                inputs.forEach(inp => inp.disabled = true);
                alert(combinedValue);  
            } else {  
                // Re-enable inputs if any becomes empty (optional, based on requirements)  
                inputs.forEach((inp, idx) => {  
                    if (inp.value.length === 0) {  
                        inputs.forEach(enableInp => enableInp.disabled = false);  
                        // return  // Stop checking further if any input is empty  
                    }  
                });  
            }  
        }  
    </script>  
</body>  
</html>